﻿<%@ Page Title="" Language="C#" MasterPageFile="~/Views/Shared/Site.Master" Inherits="System.Web.Mvc.ViewPage<object>" %>

<asp:Content ID="Content3" ContentPlaceHolderID="JSContent" runat="server">
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
    <script type="text/javascript" src="/Scripts/jquery.validate.js"></script>
    <script type="text/javascript" src="/Scripts/jquery.validate.rules.js"></script>
    <script type="text/javascript" src="/Scripts/galleria/galleria.js"></script>
    <script type="text/javascript" src="/Areas/Commerce/Scripts/Kooboo/kooboo.format.js"></script>
    <script type="text/javascript" src="/Scripts/Views/Procuct/product.question.js"></script>
    <script type="text/javascript" src="/Scripts/Views/Procuct/product.review.js"></script>
    <script type="text/javascript">
        Galleria.loadTheme('/Scripts/galleria/themes/kooboo/galleria.kooboo.js');
        $(function () {
            $('.product-preview').galleria();
        });

    </script>
    <script type="text/javascript">
        function selectPriceValueId(sender, id) {
            $("#PriceValueId").val(id);
            $(".check").each(function (index, item) {
                $(item).removeClass("current");
            });

            $(sender).addClass("current");
        }
    </script>
    <script type="text/javascript">
        $(function () {
            $(".tabs > a").click(function (event) {
                event.preventDefault();
                $(".tabs > a").removeClass("current");
                $(this).addClass("current");

                $(".tab-content").hide();

                var tab = $($(this).attr("href"));
                tab.show();
                return false;
            });
        });
    
    </script>
    <script type="text/javascript">
        $(document).ready(function () {
            $('.product-order .version').click(function (e) {
                e.preventDefault();
                $(this).siblings().removeClass('selected');
                $(this).addClass('selected');
                var price = $(this).attr("data-price");
                //var stock = $(this).attr("data-stock");
                var id = $(this).attr("data-id");
                var sku = $(this).attr("data-sku");
                var deliverydays = $(this).attr("data-deliveryDays");

                $("#field_price").text(price);
                //$("#field_stock").text(stock);
                $("#field_sku").text(sku);
                $("#saleid").val(id);
                $("#field_deliveryDays").text(deliverydays);

            });

            //choose first one as default
            $('.product-order .version:first').click();


            $("#quantity").blur(function (e) {
                //var total = parseInt($("#field_stock").text());

                // var amount = parseInt($(this).val());
                //if (amount > total) {
                //      $(this).val(total);
                // }
            });

            $("#btn_add_action").click(function (e) {
                e.preventDefault();

                var id = $("#saleid").val();
                if (id && id.length > 0) {
                    $("#form_add_cart").submit();
                }

                return false;

            });

            //initial validate
            $("#product_question").validate();
            var review_rete_validation = {
                onfocuseout: true,
                rules: {
                    Rate: {
                        required: true
                    }
                },
                messages: {
                    Rate: {
                        required: "<%: "Please choose a review rate".Localize() %>"
                    }
                }
            };
            $("#review_form").validate(review_rete_validation);

            //ajax Post question
            $("#product_question").submit(function (event) {
                if ($(this).valid()) {
                    var data = $(this).serialize();
                    $.post(
                    $(this).attr("action"),
                data,
                function (response, status, xhr) {
                    if (response && !response.Error) {
                        $("#question_success").show(300);

                        //update question count
                        var title_tab = $("#tab_question_title");
                        var num = parseInt(title_tab.attr("value"));
                        num++;
                        title_tab.attr("value", num);
                        title_tab.html("Question ( " + num + " )");

                        $("#Question").val('');

                        displayQuestion(null, null, 1);
                    }
                    else {
                        alert("<%: "Post question failure, Please try again later".Localize() %>");
                    }
                });

                }
                return false;
            });

            //ajax Post Review
            $("#review_form").submit(function (event) {
                if ($(this).valid()) {
                    var data = $(this).serialize();
                    $.post(
                        $(this).attr("action"),
                        data,
                        function (response, status, xhr) {
                            if (response && !response.Error) {
                                $("#review_form").hide();
                                $(".success").show(300);
                                $("#Remark").val('');
                            }
                            else {
                                alert("<%:"Post review failure, Please try again later.".Localize() %>");
                            }
                        });
                }
                return false;
            });

            //display
            var productId = $("#question_Product_Id").val();
            displayQuestion($("#tab-question .product-list"), productId);

            var reviewProductId = $("#review_product_id").val();
            displayReview($("#tab-review .product-list"), reviewProductId);
        });
    </script>
</asp:Content>
<asp:Content ID="Content1" ContentPlaceHolderID="MainContent" runat="server">
    <%: Html.Partial("Sidebar") %>
    <div id="main">
        <div class="main-block">
            <h2 class="title">
                <%: this.Model.Bind("Name")%></h2>
            <div class="main-block-content product clearfix">
                <div class="clearfix">
                    <div class="product-preview">
                        <% foreach (var image in (this.Model.Bind("Images") as IEnumerable))
                           { %>
                        <img src="<%= image %>" alt="" />
                        <%}%>
                    </div>
                    <dl class="product-info">
                        <dt>
                            <%:"Price:".Localize() %></dt>
                        <dd id="field_price">
                            <%: this.Model.Bind("Prices") %></dd>
                        <dt>
                            <%: this.Model.Bind("SkuAlias")%></dt>
                        <dd id="field_sku">
                            &nbsp;
                        </dd>
                        <dt>
                            <%: "DeliveryDays".Localize()%></dt>
                        <dd id="field_deliveryDays">
                            <%: this.Model.Bind("DeliveryDays") %>
                        </dd>
                        <dt>
                            <%:"Brand:".Localize() %></dt>
                        <dd>
                            <a href="<%: this.Model.Bind("BrandUrl") %>">
                                <%: this.Model.Bind("BrandName") %></a></dd>
                    </dl>
                    <div class="product-order">
                        <div class="clearfix">
                            <span>
                                <%:"Variation:".Localize() %></span>
                            <div class="version-list">
                                <% foreach (var sale in (SaleInfo[])this.Model.Bind("Sales"))
                                   {
                                %>
                                <div class="version" data-price="<%: sale.Price.ToString("c") %>" data-stock="<%: sale.Stock %>"
                                    data-id="<%: sale.Id %>" data-sku="<%= sale.Sku %>" data-deliverydays="<%=sale.DeliveryDays %>">
                                    <a href="#">
                                        <%: sale.Name  %></a>
                                    <table>
                                        <tbody>
                                            <tr>
                                                <th>
                                                    <%: "Price".Localize() %>
                                                </th>
                                                <td>
                                                    <%: sale.Price.ToString("c") %>
                                                </td>
                                            </tr>
                                            <tr>
                                                <th>
                                                    <%: "Delivery Days".Localize() %>
                                                </th>
                                                <td>
                                                    <%: sale.DeliveryDays %>
                                                </td>
                                            </tr>
                                            <tr>
                                                <th>
                                                    <%: this.Model.Bind("SkuAlias") %>
                                                </th>
                                                <td>
                                                    <%: sale.Sku %>
                                                </td>
                                            </tr>
                                            <%foreach (var item in sale.Items)
                                              {                                
                                              
                                            %>
                                            <tr>
                                                <th>
                                                    <%: item.Name %>
                                                </th>
                                                <td>
                                                    <%: item.Value %>
                                                </td>
                                            </tr>
                                            <%
                                              }%>
                                        </tbody>
                                    </table>
                                </div>
                                <%
                                   
                                   } %>
                            </div>
                        </div>
                        <div>
                            <form id="form_add_cart" action="<%= this.ViewData["AddCartAction"] %>" method="post">
                            <label for="quantity">
                                <%:"Quantity:".Localize() %></label><input type="text" id="quantity" name="Amount" value="1" />
                            <input type="hidden" id="saleid" name="SaleItemId" />
                            </form>
                        </div>
                        <div>
                            <a id="btn_add_action" class="button" href="#"><span>
                                <%:"Add to cart".Localize() %></span></a></div>
                    </div>
                </div>
                <div class="tabs">
                    <a class="current" href="#tab-desc">
                        <%:"Description".Localize() %></a> <a href="#tab-spec">
                            <%:"Specification".Localize() %></a>
                    <a href="#tab-review">
                        <%:"Reviews".Localize() %> (<%: this.Model.Bind("ReviewCount")%>)</a> <a href="#tab-question"
                        id="tab_question_title" value="<%: this.Model.Bind("QuestionCount") %>">
                            <%:"Question".Localize() %>
                        (<%: this.Model.Bind("QuestionCount")%>)</a>
                </div>
                <div id="tab-desc" class="tab-content">
                    <%= this.Model.Bind("Description")%>
                </div>
                <div id="tab-spec" class="tab-content hide">
                    <div class="table-container">
                        <table>
                            <tbody>
                                <%foreach (var spec in (SpecInfo[])this.Model.Bind("Specification"))
                                  {
                                %>
                                <tr>
                                    <th>
                                        <%= spec.Name %>
                                    </th>
                                    <td>
                                        <%= spec.Value %>
                                    </td>
                                </tr>
                                <%
                                  }  %>
                            </tbody>
                        </table>
                    </div>
                </div>
                <div id="tab-review" class="tab-content hide">
                    <div class="product-list">
                        reviews.
                    </div>
                    <%
                        if (this.ViewData["Order"] != null)
                        {
                    %>
                    <div class="common-form success hide">
                        <fieldset>
                            <p>
                                <%: "The review has been submitted sucessfully.".Localize()  %>
                            </p>
                        </fieldset>
                    </div>
                    <div class="common-form product-form">
                        <form method="post" id="review_form" action="<%:this.ViewData["ReviewAction"] %>">
                        <input type="hidden" id="review_product_id" name="Product.Id" value="<%: this.Model.Bind("Id") %>" />
                        <input type="hidden" name="Id" value="0" />
                        <input type="hidden" name="Order.Id" value="<%: this.ViewData["Order"].Bind("Id") %>" />
                        <fieldset>
                            <p class="clearfix">
                                <label for="rating">
                                    <%:"Rating:".Localize() %></label>
                                <input type="radio" name="Rate" value="1" class="star" />
                                <input type="radio" name="Rate" value="2" class="star" />
                                <input type="radio" name="Rate" value="3" class="star" />
                                <input type="radio" name="Rate" value="4" class="star" />
                                <input type="radio" name="Rate" value="5" class="star" />
                            </p>
                            <p>
                                <label for="review">
                                    <%:"Review:".Localize() %></label>
                                <textarea id="Remark" name="Remark" rows="6" cols="127" class="review"></textarea>
                            </p>
                        </fieldset>
                        <fieldset class="buttons">
                            <button type="submit" class="button">
                                <em><span>
                                    <%:"Submit".Localize() %></span></em></button>
                        </fieldset>
                        </form>
                    </div>
                    <%} %>
                </div>
                <div id="tab-question" class="tab-content hide">
                    <div class="product-list">
                    </div>
                    <div id="question_success" class="hide">
                        <%:"The question has been submitted successfully.".Localize() %>
                    </div>
                    <div class="common-form product-form">
                        <form id="product_question" action="<%: this.ViewData["QuestionAction"] %>" method="post">
                        <input type="hidden" id="question_Product_Id" name="Product.Id" value="<%: this.Model.Bind("Id") %>" />
                        <input type="hidden" name="Id" value="0" />
                        <fieldset>
                            <p>
                                <label for="QuestionBy">
                                    <%:"Name:".Localize() %></label>
                                <input type="text" id="QuestionBy" name="QuestionBy" class="name" value="<%: this.ViewBag.Username%>">
                            </p>
                            <p>
                                <label for="QuestionEmail">
                                    <%:"EMail:".Localize() %></label>
                                <input type="text" id="QuestionEmail" name="QuestionEmail" class="require_email"
                                    value="<%: this.ViewBag.UserEmail %>">
                            </p>
                            <p>
                                <label for="Question">
                                    <%:"Question:".Localize() %></label>
                                <textarea id="Question" name="Question" rows="6" cols="127" class="question"></textarea>
                            </p>
                        </fieldset>
                        <fieldset class="buttons">
                            <button type="submit" class="button">
                                <em><span>
                                    <%:"Submit".Localize() %></span></em></button>
                        </fieldset>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="Breadcrumb" runat="server">
    <%: Html.Partial("Breadcrumb") %>
</asp:Content>
